<template>
    <div class="body">
        <button class="operation btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">添加商品</button>
        <table class="table table-bordered">
            <tbody><tr>
                <th>商品编号</th>
                <th>商品名称</th>
                <th>商品描述</th>
                <th>商品库存</th>
                <th>商品尺寸</th>
                <th>是否下架</th>
                <th>操作</th>
            </tr>
            <tr>
                <td>6</td>
                <td>【莹恋】MIZUNO美津浓V1GA159002乒乓球鞋男鞋女鞋室内综合训练鞋</td>
                <td>商品描述</td>
                <td>44</td>
                <td>35-56</td>
                <td>已上架商品</td>
                <td>
                    <button type="button" class="btn btn-danger">下架</button>
                </td>
            </tr>
            </tbody></table>
        <div class="modal fade bs-example-modal-lg" style="display: none;">
            <div class="modal-dialog modal-lg">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span>×</span></button>
                        <h4 class="modal-title" id="myLargeModalLabel">添加商品</h4>
                    </div>
                    <div class="modal-body">
                        <div class="form-group">
                            <select class="form-control">
                                <option>-- 请选择品牌 --</option>
                            </select>
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="请输入产品名称">
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="请输入产品描述">
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="请输入产品数量">
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="请输入产品尺码,如29-39">
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="请输入商品原价">
                        </div>
                        <div class="form-group">
                            <input type="text" class="form-control" placeholder="请输入商品折扣">
                        </div>
                        <div class="form-group">
                            <input type="file" accept="image/jpeg" multiple="">
                            <p class="help-block">最多上传三张图片</p>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-primary" id="addProduct">添加</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>

    //由于商品列表的渲染与之前的分类界面功能类似，不再完成
    export default {
        name: "product"
    }
</script>

<style scoped>

</style>